<template>
    <div class="qingwu">
        <div class="admin_table_page_title">反馈信息</div>
        <div class="unline underm"></div>

        <div class="admin_table_handle_btn">
            <a-button
                @click="$router.push('/Seller/feedback_info/form')"
                type="primary"
                icon="plus"
            >添加
            </a-button
            >
            <a-button
                class="admin_delete_btn"
                type="danger"
                icon="delete"
                @click="del"
            >批量删除
            </a-button
            >
        </div>
        <div class="admin_table_list">
            <a-table
                :columns="columns"
                :data-source="list"
                :pagination="false"
                :row-selection="{
          selectedRowKeys: selectedRowKeys,
          onChange: onSelectChange,
        }"
                row-key="community_id"
            >
        <span slot="userinfo" slot-scope="rows">
          <img :src="rows.avatar" alt=""/>
        </span>
                <span slot="userinfos" slot-scope="rows">
          {{ rows.nickname }}
        </span>

                <span slot="feedback_cate" slot-scope="rows">
          {{ rows.feedback_class_name }}
        </span>
                <span slot="action" slot-scope="rows">
          <a-button
              icon="edit"
              @click="$router.push('/Admin/feedback_info/form/' + rows.id)"
          >查看</a-button>
        </span>

                <span slot="is_read" slot-scope="rows">
          <a-switch
              v-if="rows.is_read == 1"
              checked-children="未读"
              un-checked-children="未读"
              @change="onChangeStatus(rows.id)"
              default-checked
          />
          <a-switch
              v-else
              checked-children="已读"
              @change="onChangeStatus(rows.id)"
              un-checked-children="已读"
          />
        </span>
            </a-table>
            <div class="admin_pagination" v-if="total > 0">
                <a-pagination
                    v-model="params.page"
                    :page-size.sync="params.per_page"
                    :total="total"
                    @change="onChange"
                    show-less-items
                />
            </div>
        </div>
    </div>
</template>

<script>
export default {
    components: {},
    props: {},
    data() {
        return {
            params: {
                page: 1,
                per_page: 30,
            },
            total: 0, //总页数
            selectedRowKeys: [], // 被选择的行
            columns: [
                {title: "#", dataIndex: "id", fixed: "left"},
                {
                    title: "用户姓名", dataIndex: "userinfo",
                    scopedSlots: {customRender: "userinfos"},
                },
                {
                    title: "用户头像",
                    dataIndex: "userinfo",
                    scopedSlots: {customRender: "userinfo"},
                },
                {title: "反馈信息", dataIndex: "feedback_content"},
                {
                    title: "反馈分类",
                    dataIndex: "feedback_cate",
                    ellipsis: true,
                    scopedSlots: {customRender: "feedback_cate"},
                },
                {title: "是否已读", scopedSlots: {customRender: "is_read"}},
                {
                    title: "操作",
                    fixed: "right",
                    scopedSlots: {customRender: "action"},
                },
            ],
            list: [],
            name: "",
            cate_id: "",
            options: [],
            areas: [],
            classify: [],
        };
    },
    watch: {},
    computed: {},
    methods: {
        // 选择分类
        handleChange(e) {
            // console.log(e)
            this.cate_id = e;
        },
        // 选择框被点击
        onSelectChange(selectedRowKeys) {
            this.selectedRowKeys = selectedRowKeys;
        },
        // 选择分页
        onChange(e) {
            this.params.page = e;
        },
        // 省市区发生改变事件
        onChangeArea(value, selectedOptions) {
            this.areas = value;
        },
        // 删除
        del() {
            if (this.selectedRowKeys.length == 0) {
                return this.$message.error("未选择数据.");
            }
            this.$confirm({
                title: "你确定要删除选择的数据？",
                content: "确定删除后无法恢复.",
                okText: "是",
                okType: "danger",
                cancelText: "取消",
                onOk: () => {
                    let ids = this.selectedRowKeys.join(",");
                    this.$delete(this.$api.feedbackInfo + "/" + ids).then((res) => {
                        if (res.code == 200) {
                            this.onload();
                            this.$message.success("删除成功");
                        } else {
                            this.$message.error(res.msg);
                        }
                    });
                },
            });
        },

        // 搜索
        search() {
            this.params["name"] = this.name;
            this.params["cate_id"] = this.cate_id;
            this.params["areas"] = this.areas;
            this.$get(this.$api.feedbackInfo, this.params).then((res) => {
                this.total = res.data.total;
                this.list = res.data.data;
            });
        },

        // 重置
        reset() {
            location.reload();
        },

        // 获取城市列表
        get_area() {
            this.$get(this.$api.areasLists).then((res) => {
                this.options = res.data;
            });
        },

        onload() {

            this.$get(this.$api.feedbackInfo, this.params).then((res) => {
                this.total = res.data.total;
                this.list = res.data.data;
                console.log(this.list);
            });
        },

        onChangeStatus(id) {
            this.$post(this.$api.editFeedbackInfoShow, {
                id: id,
            }).then((res) => {
                if (res.code == 200) {
                    this.$message.success(res.msg);
                } else {
                    return this.$message.error(res.msg);
                }
            });
        },
    },
    created() {
        this.onload();
        // this.get_area();
        // this.getPropertyLists();
    },
    mounted() {
    },
};
</script>
<style lang="scss" scoped>
</style>
